<template>
    <h2>仓库调拨申请列表</h2>
    <el-form :model="form" :inline="true">
        <el-form-item label="单据主题">
            <el-input v-model="form.RTName" clearable style="width: 200px;" />
        </el-form-item>
        <el-form-item label="单据编号">
            <el-input v-model="form.RTNumber" clearable style="width: 200px;" />
        </el-form-item>
        <el-button type="primary" @click="GetShowTime()">查询</el-button>
        <el-button type="danger" @click="DelAll()">批量删除</el-button>
        <el-button type="success" @click="AddRequestTransfers()">新增</el-button>
        <el-button @click="Export()">导出</el-button>
    </el-form>
    <el-table :data="RequestTransfersList" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55" />
        <el-table-column prop="rtNumber" label="仓库调拨申请编号">
            <template v-slot="scope">
                <a @click="RequestTransfersFF(scope.row.requestTransfersId)">{{ scope.row.rtNumber }}</a>
            </template>
        </el-table-column>
        <el-table-column prop="rtName" label="仓库调拨申请名称">
            <template v-slot="scope">
                <a @click="RequestTransfersFF(scope.row.requestTransfersId)">{{ scope.row.rtName }}</a>
            </template>
        </el-table-column>
        <el-table-column prop="rtAuditors" label="审核人员" />
        <el-table-column prop="apaNumberApplication" label="申请数量" />
        <el-table-column prop="rtSmark" label="调拨申请备注" />
        <el-table-column label="操作">
            <template #default="scope">
                <el-button size="small" @click="handleEdit(scope.$index, scope.row)">
                    详情
                </el-button>
                <el-button size="small" @click="handleEditUpd(scope.$index, scope.row)">
                    修改
                </el-button>
                <el-button size="small" type="danger" @click="handleDelete(scope.$index, scope.row)">
                    删除
                </el-button>
            </template>
        </el-table-column>
    </el-table>
    <table>
        <tr>
            <td>
                <el-pagination v-model:current-page="Page.PageIndex" v-model:page-size="Page.PageSize"
                    :page-sizes="[5, 10, 15, 20]" :background="true" layout="slot, sizes" prev-text="上一页"
                    next-text="下一页" :total="Page.listcount" @size-change="handleSizeChange"
                    @current-change="handleCurrentChange">
                    共{{ Page.listcount }}条数据，每页{{ Page.PageSize }}条，共{{ Page.PageIndex }}/{{ Page.pagecount }}页
                </el-pagination>
            </td>
            <td>
                <el-pagination v-model:current-page="Page.PageIndex" v-model:page-size="Page.PageSize"
                    :page-sizes="[5, 10, 15, 20]" :background="true" layout="slot, prev, pager, next" prev-text="上一页"
                    next-text="下一页" :total="Page.listcount" @size-change="handleSizeChange"
                    @current-change="handleCurrentChange">
                    <el-button :disabled="Page.PageIndex == 1" @click="handleCurrentChange(1)">首页</el-button>
                </el-pagination>
            </td>
            <td>
                <el-pagination v-model:current-page="Page.PageIndex" v-model:page-size="Page.PageSize"
                    :page-sizes="[5, 10, 15, 20]" :background="true" layout="slot, jumper" prev-text="上一页"
                    next-text="下一页" :total="Page.listcount" @size-change="handleSizeChange"
                    @current-change="handleCurrentChange">
                    <el-button :disabled="Page.PageIndex == Page.pagecount"
                        @click="handleCurrentChange(Page.pagecount)">尾页</el-button>
                </el-pagination>
            </td>
        </tr>
    </table>
</template>
<script setup lang="ts">
import { onMounted, ref, reactive } from "vue";
import { useRoute, useRouter } from "vue-router";
import { ElMessage, ElMessageBox } from "element-plus";
import axios from "axios";
import http from '../../../http.js'
const route = useRoute();
const router = useRouter();
const form = reactive({
    RTName: '',
    RTNumber: ''
})
//生命周期函数钩
onMounted(() => {
    GetShowTime();
})
//分页
const Page = ref({
    PageIndex: 1,
    PageSize: 10,
    listcount: 0,
    pagecount: 0
})
const handleSizeChange = (val: number) => {
    Page.value.PageSize = val;
    GetShowTime()
}
const handleCurrentChange = (val: number) => {
    Page.value.PageIndex = val;
    GetShowTime()
}
const RequestTransfersList = ref([])
const GetShowTime = () => {
    axios.get(http.zblnb+'/erpck/api/RequestTransfers/ShowRequestTransfers', {
        params: {
            RTName: form.RTName,
            RTNumber: form.RTNumber,
            PageIndex: Page.value.PageIndex,
            PageSize: Page.value.PageSize
        }
    }).then((res) => {
        RequestTransfersList.value = res.data.data.list
        Page.value.listcount = res.data.data.totalCount
        Page.value.pagecount = res.data.data.pageCount
    })
}
//详情仓库调拨申请
const handleEdit = (index: number, row: any) => {
    router.push({
        path: 'XqRequestTransfers',
        query: {
            rId: row.requestTransfersId
        }
    })
}
//修改仓库调拨申请
const handleEditUpd = (index: number, row: any) => {
    router.push({
        path: 'UpdRequestTransfers',
        query: {
            rId: row.requestTransfersId
        }
    })
}
//删除仓库调拨申请
const handleDelete = (index: number, row: any) => {
    console.log(row)
    ElMessageBox.confirm(
        '确定删除吗?',
        'Warning',
        {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
        }
    )
        .then(() => {
            axios.post(http.zblnb+'/erpck/api/RequestTransfers/RequestTransfersDel', {
                "requestTransfersId": [
                    row.requestTransfersId
                ],
                "delName": "王思雨"
            }).then((res) => {
                if (res.data.data > 0) {
                    ElMessage.success('删除成功')
                    GetShowTime()
                }
                else {
                    ElMessage.error('删除失败')
                }
            })
        })
        .catch(() => {
            ElMessage({
                type: 'info',
                message: '已取消',
            })
        })
}
//批量删除
const Del = reactive({
    allocateId: [],
    delName: ''
})
interface Warehouse {
    requestTransfersId: number; // 或者 string  
}
const check=ref([])
const handleSelectionChange = (val: Warehouse[]) => {
    Del.allocateId = []; // 如果希望每次重置数组，请取消注释  
    check.value=val
    val.forEach((item) => {
        if (!Del.allocateId.includes(item.requestTransfersId)) {
            Del.allocateId.push(item.requestTransfersId);
        }
    });
    console.log(Del.allocateId);
};
//批量逻辑删除
const DelAll = () => {
    ElMessageBox.confirm(
        '确定删除吗?',
        '提示',
        {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
            center: true,
        }
    )
        .then(() => {
            axios.post(http.zblnb+'/erpck/api/RequestTransfers/RequestTransfersDel', {
                requestTransfersId: Del.allocateId,
                delName: "王思雨"
            }).then((res) => {
                if (res.data.data > 0) {
                    ElMessage.success('删除成功')
                    GetShowTime()
                }
                else {
                    ElMessage.error('删除失败')
                }
            })
        })
        .catch(() => {
            ElMessage({
                type: 'info',
                message: '已取消',
            })
        })
}
//跳转添加页面
const AddRequestTransfers = () => {
    router.push('/AddRequestTransfers')
}
// RequestTransfersFF
//#region 
//仓库名称跳转
const RequestTransfersFF = (requestTransfersId: Number) => {
    router.push('/XqRequestTransfers?rId=' + requestTransfersId);
}
//#endregion
//导出
import * as XLSX from 'xlsx';
const Export = () => {
    ElMessageBox.confirm('是否确认导出?', '警告', {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: 'warning',
    })
        .then((res) => {
            if (check.value.length <= 0) {
                ElMessage.warning('请选择数据!');
                return;
            }
            //表头
            let tableData = [
                ['序号','仓库调拨申请编号', '仓库调拨申请名称', '审核人员', '申请数量', '调拨申请备注']
            ]
            check.value.forEach((item, index) => {
                let rowData = []
                //导出内容的字段
                rowData = [
                    index + 1,
                    item.rtNumber,
                    item.rtName,
                    item.rtAuditors,
                    item.apaNumberApplication,
                    item.rtSmark,
                ]
                tableData.push(rowData)
            })
            let workSheet = XLSX.utils.aoa_to_sheet(tableData);
            let bookNew = XLSX.utils.book_new();
            XLSX.utils.book_append_sheet(bookNew, workSheet, '调拨申请') // 工作簿名称
            let name = '调拨申请' + '.xlsx'
            XLSX.writeFile(bookNew, name) // 保存的文件名
        })
}
</script>